<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<html lang="zh-cn">
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
		<title></title>
		<link href="${webroot}/static/plugins/bootstrap-3.3.0/css/bootstrap.min.css" rel="stylesheet"/>
		<!--时间插件-->
		<link rel="stylesheet" href="${webroot}/static/css/bootstrap-datetimepicker.min.css">
		<!--重置文件-->
		<link rel="stylesheet" href="${webroot}/static/plugins/inputFile/css/style.css" />
		<link rel="stylesheet" href="${webroot}/static/plugins/inputFile/css/ssi-uploader.min.css">
		<link rel="stylesheet" href="${webroot}/static/plugins/icheck/custom.css">
		<link rel="stylesheet" href="${webroot}/static/plugins/icheck/skins/all.css">
		<link rel="stylesheet" href="${webroot}/static/css/reset.css">
		<link rel="stylesheet" href="${webroot}/static/css/merchantGrant.css">
		<jsp:include page="../common/common.jsp"/>
		<style>
			 .help-block{
	        	float: left;
	        	padding-left: 160px;
	        }
	        .has-feedback{
	        	width: 510px;
	        }
			#ssi-clearBtn{
					display: none;
				}
				 .help-block{
	        	float: left;
	        	padding-left: 160px;
	        }
	        .has-feedback{
	        	width: 480px;
	        }
		</style>
	</head>
	<body>
		<section class="content">
			<ol class="breadcrumb">
				<li>系统参数管理</li>
				<li class="active">系统参数列表</li>
				<li class="active">创建系统参数</li>
			</ol>
			<article id="defaultForm"  class="searchsForm clearfix form-horizontal">
				<div class="form-group clearfix">
					<div class="col-lg-3 col-md-3 col-lg-offset-9 col-md-offset-9">
						<button type="text" id="subButton" class="btn btn-primary w-50 fr" style="margin-left: 10px; margin-right: 10px;">提交</button>
						<button type="text" id="resetButton" class="btn btn-primary w-50 fr btn-reset" >重置</button>
						<button type="text" id="returnButton" class="btn btn-primary w-50 fr" style="margin-right:10px;">返回</button>
					</div>
				</div>
				<div class="form-group clearfix">
					<label class="fl w-160 control-label">键名称<font style="color: red;"> *</font></label>
					<div class="fl w-300">
						<input type="text" id="keyName" name="keyName" class="form-control" />
					</div>	
				</div>
				<div class="form-group clearfix">
					<label class="fl w-160 control-label">键英文名称<font style="color: red;"> *</font></label>
					<div class="fl w-300">
						<input type="text" id="keyEname" name="keyEname" class="form-control" />
					</div>
				</div>
				<div class="form-group clearfix">
					<label class="fl w-160 control-label">键值<font style="color: red;"> *</font></label>
					<div class="fl w-300">
						<input type="text" id="keyValue" name="keyValue" class="form-control" value=""/>
					</div>
				</div>
				<div class="form-group clearfix">		   
				    <label class="fl w-160 control-label">是否启用<font style="color: red;"> *</font></label>
					<div class="fl w-300">
						<select class="form-control" id="status" name="status">
							<option value="1">是</option>
							<option value="0">否</option>
						</select>
					</div>					     			    
				</div>
				<div class="form-group clearfix">
					<label class="fl w-160 control-label">备注</label>
					<div class="fl w-300">
						<input type="text" id="remark" name="remark" class="form-control" value=""/>
					</div>
				</div>
			</article>
		</section>
		<script src="${webroot}/static/js/bootstrap-datetimepicker.min.js"></script>
		<!--时间语言插件-->
		<script src="${webroot}/static/js/bootstrap-datetimepicker.zh-CN.js"></script>
		<script type="text/javascript" src="${webroot}/static/plugins/icheck/icheck.js"></script>
		<script type="text/javascript" src="${webroot}/static/plugins/icheck/custom.js"></script>
		<!--ajax上传图片  -->
		<script src="${webroot}/static/plugins/inputFile/js/ssi-uploader.js"></script>
		<script src="${webroot}/static/js/ajaxUpload.js"></script>
		<script type="text/javascript">
			// 时间插件
			$(".form_datetime").datetimepicker({
				//时间格式
			     format: 'yyyy-mm-dd hh:ii:ss',
				 language: 'zh-CN',
				 autoclose: true,
				 minView: 0
			});
			$('#subButton').click(function(){
				var bootstrapValidator =  $('#defaultForm').data('bootstrapValidator');
 				bootstrapValidator.validate();
				  if(!bootstrapValidator.isValid()){
					  return;
			       }
				var keyName = $('#keyName').val();
				var keyEname = $('#keyEname').val();
				var keyValue = $('#keyValue').val();
				var status = $('#status option:selected').val();
				var remark = $('#remark').val();
				
				$.confirm({
	                type: 'green',
	                animationSpeed: 300,
		            title:"确定提交吗?",
	                content: "",
	                buttons: {
	                    confirm: {
	                        text: '确认',
	                        btnClass: 'waves-effect waves-button',
	                        action: function () {
	                        	$.ajax({
	        						type:"POST",
	        						data:{
	        							keyName : keyName,
	        							keyEname : keyEname,
	        							keyValue : keyValue,
	        							status : status,
	        							remark : remark
	        						},
	        						url:webroot+'/admin/sysparams/addSysParams',
	        						dataType:'json',
	        						success:function(data){
	        							checkResponseData(data, "1", webroot+'/admin/page/sysparams/sysParamsList');
	        						}
	        					});
	                        }
	                    },
	                    cancel: {
	                        text: '取消',
	                        btnClass: 'waves-effect waves-button'
	                    }
	                }
	            });
			})

			//  富文本编辑插件
			//var ue = UE.getEditor('container');

			$("#resetButton").click(function (){
				$("#keyName").val('');
				$("#keyEname").val('');
				$("#keyValue").val('');
				$("#status").val('');
				$("#remark").val('');
			});
			$("#returnButton").click(function (){
				window.location.href=webroot+'/admin/page/sysparams/sysParamsList'
			});
			 $('#defaultForm').bootstrapValidator({
		            feedbackIcons: {/*输入框不同状态，显示图片的样式*/
		                valid: 'glyphicon glyphicon-ok',
		                invalid: 'glyphicon glyphicon-remove',
		                validating: 'glyphicon glyphicon-refresh'
		            },
		            fields: {/*验证*/
		            	keyName: {
		                    validators: {
		                    	notEmpty: {/*非空提示*/
		                            message: '键名称不能为空'
		                        },
		                        regexp: {
		                            regexp: /^[a-zA-Z0-9_\.\u2E80-\u9FFF]+$/,  
		                            message: '请输入汉字,字母或者数字'  
		                        },
		                        stringLength: {/*长度提示*/
		                            min: 2,
		                            max: 50,
		                            message: '名称长度必须在2到50之间'
		                        }/*最后一个没有逗号*/
		                    }
		                },
		                keyEname: {
		                	validators: {
		                        notEmpty: {/*非空提示*/
		                            message: '键英文名称不能为空'
		                        },
		                        regexp: {  
		                            regexp: /^[a-zA-Z_\.]+$/,  
		                            message: '请输入字母'  
		                        },
		                        stringLength: {/*长度提示*/
		                            min: 2,
		                            max: 30,
		                            message: '键英文名称长度必须在2到30之间'
		                        }
		                    }
		                },
		                keyValue: {
		                    validators: {
		                        notEmpty: {/*非空提示*/
		                            message: '键值不能为空'
		                        }
		                    }
		                }
		            }
		     });
		</script>
	</body>
</html>
